<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">

    <body>
        <ui:composition template="./plantillas/plantillaGeneral.xhtml">
            <ui:define name="titulo">
                Demo EJB+JPA+JSF :: Catálogo de productos
            </ui:define>

            <ui:define name="encabezado">
                <ui:include src="./plantillas/vistaCabecera.xhtml"/>
            </ui:define>

            <ui:define name="izquierda">
                <ui:include src="./plantillas/vistaIzquierda.xhtml"/>
            </ui:define>

            <ui:define name="contenido">
                <h:form>
                    <h3>
                        <h:outputText value="Listado de productos"/>
                    </h3>

                    <h:panelGroup styleClass="errores">
                        <h:messages layout="table" showDetail="true" />
                    </h:panelGroup>

                    <h3>
                        <h:outputText value="#{catalogoController.familiaActual.nombre}"
                                      rendered="#{catalogoController.familiaActual != null}"/>
                    </h3>
                    <h2>
                        <h:outputText value="No hay productos que mostrar"
                                      rendered="#{empty catalogoController.productos}" />
                    </h2>

                    <h:dataTable value="#{catalogoController.productos}" var="producto"
                                 rendered="#{not empty catalogoController.productos}"
                                 border="0" cellpadding="4" cellspacing="0" rules="all" style="border:solid 1px">
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Familia"/>
                            </f:facet>
                            <h:outputText value="#{producto.familia.nombre}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Id"/>
                            </f:facet>
                            <h:outputText value="#{producto.id}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Descripcion"/>
                            </f:facet>
                            <h:commandLink action="#{catalogoController.doVerProductoActual(producto.id)}"
                                           value="#{producto.descripcion}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Marca"/>
                            </f:facet>
                            <h:outputText value="#{producto.marca}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Modelo"/>
                            </f:facet>
                            <h:outputText value="#{producto.modelo}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Precio"/>
                            </f:facet>
                            <h:outputText value="#{producto.precio}"/>
                        </h:column>
                        <h:column>
                            <h:commandLink action="#{carroCompraController.doAnadirProducto(producto.id)}"
                                           value="Añadir al carro"/>
                        </h:column>
                    </h:dataTable>
                </h:form>



            </ui:define>

        </ui:composition>

    </body>
</html>
